<template>
  <div class="layout-padding row justify-center" >
    <div style="width: 600px; max-width: 100vw;">
      <topic-one-compo :topic="topic" :isDetail="false" v-on:topic-delete="handleDeleteAft" >
         <reply-list-compo ref="topicReplyList" slot="details" :hasDetails="true" :isTopic="true" :replyTarid="topicId"></reply-list-compo>
     </topic-one-compo>
      <!-- 回复 -->
      <content-edit-compo ref="topicEdit" v-on:commit-result="handlerReply" :enablePicChoice="false" :isAddIcon="false"></content-edit-compo>
    </div>
  </div>
</template>

<script>
import replyListCompo from "./reply-list-compo";
import topicOneCompo from "./topic-one-compo";
import commonCompo from "../common-compo";
import contentEditCompo from '../content-edit-compo'
import topicApi from "../../../https/topicApi";
import replyApi from "../../../https/replyApi";
import attentionApi from "../../../https/attentionApi";
export default {
  components: {
    replyListCompo,
    topicOneCompo,
    commonCompo,
    contentEditCompo
  },
  data() {
    return {
      topicId: Number.parseInt(this.$route.query.topicId),
      topic: { lz: {}, attashments: [] },
      replys: [],
      page: 0,
      totalPage: 0
    };
  },
  mounted() {
    this.loadTopicDetail();
    //测试数据：
      // this.topic = {
      //   id: this.page + 10,
      //   lz: {
      //     id: 12,
      //     nickname: "陈翔六点版半",
      //     logoRes: "statics/boy-avatar.png"
      //   },
      //   createdDate: Date.now(),
      //   isHot: true,
      //   isFans: false,
      //   liked: true,
      //   likedcount: 16200,
      //   replycount: 1440,
      //   allowDel: true,
      //   attashments: ["statics/mountains.jpg", "statics/parallax1.jpg"],
      //   content:
      //     "是啊，当我们爬的越来越高时，我们对于这个世界就会越来越陌生，因为我们已经有资格去接触真相了；而对于那些已经站在世界之巅的人来说：看着别人在攀爬，在挣扎，确实他们的乐趣之一"
      // };
  },
  methods: {
    loadTopicDetail() {
      const _id = this.topicId;
      if (_id) {
        //帖子信息
        topicApi
          .get(_id)
          .then(res => {
             if(res.status == 200) {
               this.topic = res.data;
               console.log('对应的topic:',this.topic);
             }
          })
          .catch(err => {});
      }
    },
    handleDeleteAft() {
      console.log('详情中删除topic：',this.topicId);
      this.$router.go(-1);
    },
    handlerReply(commitResult){
      const params = {topic:true,replyTarid:this.topicId,replyTaruser:this.topic.lz,content:commitResult.content};
      console.log('回复主题：',params);
      replyApi.add(params).then(res=>{
            if(res.status == 200) {
                 this.$refs.topicReplyList.clearDatas();
                 this.$refs.topicReplyList.loadData();
                 this.loadTopicDetail();
                 this.$refs.topicEdit.clearDatas();
            }
          }).catch(err=>{})
    },
  }
};
</script>
